@media (max-width: 768px) {

    .header {
        position: absolute;
    }

    /*sidebar*/


    #sidebar {
        display: none;
    }

    .sidebar-close #sidebar {
        height: auto;
        /*overflow: hidden;*/
        overflow-y: auto;
        position: absolute;
        width: 100%;
        z-index: 1001;
        display: block;
    }

    ul.sidebar-menu {
    margin-top: 100px;
}

    /* body container */
    #main-content {
        margin: 0px !important;
        position: none !important;
    }

    #sidebar > ul > li > a > span {
        line-height: 35px;
    }

    #sidebar > ul > li {
        margin: 0 10px 5px 10px;
    }

        #sidebar > ul > li > a {
            height: 35px;
            line-height: 35px;
            padding: 0 10px;
            text-align: left;
        }

            #sidebar > ul > li > a i {
                /*display: none !important;*/
            }





        #sidebar > ul > li > a, #sidebar > ul > li > ul.sub > li {
            width: 100%;
        }

            #sidebar > ul > li > ul.sub > li > a {
                background: transparent !important;
            }

                #sidebar > ul > li > ul.sub > li > a:hover {
                    /*background: #4A8BC2 !important ;*/
                }


    /* sidebar */
    #sidebar {
        margin: 0px !important;
    }

        /* sidebar collabler */
        #sidebar .btn-navbar.collapsed .arrow {
            display: none;
        }

        #sidebar .btn-navbar .arrow {
            position: absolute;
            right: 35px;
            width: 0;
            height: 0;
            top: 48px;
            border-bottom: 15px solid #282e36;
            border-left: 15px solid transparent;
            border-right: 15px solid transparent;
        }

    .arrow {
        top: 8px;
    }

    ul.sidebar-menu li ul.sub li a {
        padding: 0;
    }
}